<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        div{
            height: 50px;
            width: auto;
            margin: 0 ;

            padding: 0 22px;
            background: rgba(0,0,0,0.8);
            position: relative;
        }

        ul{
            line-height: 45px;
            margin-top: 0;
            margin-left: 500px;
            list-style-type: none;
        }
        li{

            float: left;
            margin-right: 20px;

        }
        #l{

            position: absolute;
            left: 520px;
            margin-top: 13px;
            height: 20px;
        }
        #r{

            margin-top: 15px;
            height: 20px;

        }
        a{
            text-decoration: none;
            color: #f5f5f7;
        }

    </style>
</head>
<body>
<div>
    <ul>
        <img src="../imgs/apple.png" id="l" alt="">
        <li><a href="">商店</a></li>
        <li><a href="">Mac</a></li>
        <li><a href="">iPad</a></li>
        <li><a href="">iphone</a></li>
        <li><a href="">Watch</a></li>
        <li><a href="">AirPods</a></li>
        <li><a href="">家居</a></li>
        <li><a href="">Apple独家</a></li>
        <li><a href="">配件</a></li>
        <li><a href="">技术支持</a></li>
        <img src="../imgs/search.png" id="r" alt="">
    </ul>
</div>
</body>
</html>